// ImageGroup.tsx
import React from 'react';

// 定义组件的属性类型
interface ImageGroupProps {
    title: string;      // 图片组的标题
    images: string[];   // 图片的URL数组
}

// 定义ImageGroup组件
const ImageGroup: React.FC<ImageGroupProps> = ({ title, images }) => {
    return (
        <div className='source_material'> {/* 外层容器，使用source_material类 */}
            <h3>{title}</h3> {/* 显示标题 */}
            <span>全部 <i className='iconfont icon-arrow-right'></i></span> {/* 显示“全部”文字和图标 */}
            <div className='source_material_img'> {/* 图片容器，使用source_material_img类 */}
                {images.map((src, index) => (  // 遍历图片数组
                    <img 
                        key={index}  // 为每个图片设置唯一的key，使用索引
                        src={src}    // 图片的src属性
                        alt={title}  // 图片的alt属性，使用组标题作为描述
                    />
                ))}
            </div>
        </div>
    );
};

export default ImageGroup; // 导出ImageGroup组件
